/**
 * @copyright SilverBiology, LLC
 * @website http://www.silverbiology.com
*/

Ext.namespace('Gbif.Glossary')

Gbif.Glossary.WelcomePanel = function(config){
	
	this.SearchStore = new Ext.data.JsonStore({
			url: 'api/api.php'
		, root: 'records'
		, totalProperty: 'totalCount'
		, baseParams: {
					cmd: 'search'
				,	searchType: ''					
			}
		,	fields: ['term','definitions', 'definitionCount', 'related', 'relatedCount', 'refLink', 'termID','calues','codeAbbrivation','codeStatus','code','termStatus', 'mainRefLink']
		,	listeners: {
				beforeload: function( store, rec ) {
/*					
					if (Ext.isEmpty(rec.params.query)) {
						return(false);
					}
*/					
				}
			}
	}, this );

	this.searchViewTpl = new Ext.XTemplate(
		'<div class="terms">',
		'<tpl for=".">',
			'<div class="termRow" id="termRow">',
			'<div id="search-terms-{term}"><div style="margin-bottom: 5px"><b>{term}',
				'<tpl if="relatedCount &gt;= 1">',
					' (Alternative terms: <i>',
					'<tpl for="related">',
						' {term}',
						'<tpl if="xindex != xcount">,</tpl>',
					'</tpl>',
					'</i>)',
				'</tpl>',
				'</b></div>',
				
				'<tpl if="definitionCount &gt; 1">',
					'<tpl for="definitions">',
						'<div class="definition">',
						'<p>{#}. {def}</p>',
						'<tpl if="code != null && code != \'\'">',
							'{code}</tpl>',		
						'<div class="refLink">uri: {parent.refLink}/{#}</div>',
						'</div>',
					'</tpl>',
				'</tpl>',
				
				'<tpl if="definitionCount == 1">',
					'<tpl for="definitions">',
						'<div class="definition">',
						'<p>{def}</p>',
						'<tpl if="code != null && code != \'\'">',
							'{code}</tpl>',
						'<tpl if="codeStatus != null && codeStatus != \'\'">',
							' <span class="codeStatus">{codeStatus}</span></tpl>',
						'<div class="refLink">uri: {parent.refLink}/1</div>',
						'</div>',
					'</tpl>',
				'</tpl>',
/*
				'<div style="padding-top: 5px">',
					'<a href="#" gg:type="links" lFlag=false ><img class="refArrowClosed" src=""></a><span class="linkTxt">Show Links</span>',
					'<div class="refLinksWrapper">',
						'<div class="refLink"><img src="resources/images/icons/html_file.png">{refLink}</div>',
						'<div class="refLink"><a class="exi" href="{refLink}/skos" target="_blank"><img src="resources/images/icons/xml_file.png">{refLink}/skos</a></div>',
						'<div class="refLink"><a class="exi" href="{refLink}/json" target="_blank"><img src="resources/images/icons/json_file.png">{refLink}/json</a></div>',
					'</div>',
				'</div>',
*/				
			'</div>',
			'</div>',
		'</tpl>',
		'</div>'
	);

	this.searchView = new Ext.DataView({
			autoHeight: true
		,	store: this.SearchStore
		,	tpl: this.searchViewTpl	
		,	loadingText: 'Searching...' 	
		,	overClass: '' 
		,	itemSelector: 'div.searchresult'
	});

	this.filterCombo = new Ext.ux.SelectBox({
			width: 100
		, value: ['startswith']
		,	id: 'filterCombo'
		,	hiddenName: 'value' 			
		,	displayField: 'name'
		,	valueField: 'value' 
		, store: new Ext.data.SimpleStore({
					fields: ['name', 'value']
				, data: [ 
							['Starts With', 'startswith']
						,	['Ends With', 'endswith']
						,	['Any Match', 'anymatch']
						,	['Exact Match', 'exact']
					]
			})
	}); 

	this.searchTerms =  new Ext.ux.form.SearchField({
			store: this.SearchStore
		, width: 125
		,	hiddenId: 'terms'
	}); 

	this.searchTerms.onTrigger2Click = this.searchTerms.onTrigger2Click.createInterceptor(function(e, d, c) {
		this.SearchStore.baseParams.searchType = this.filterCombo.getValue();
		this.SearchStore.baseParams.highlight = 0;
	}, this);
	
	this.searchDefinition =  new Ext.ux.form.SearchField({
			store: this.SearchStore
		, width: 125
		,	hiddenId: 'definitions'
	}); 

	this.searchDefinition.onTrigger2Click = this.searchDefinition.onTrigger2Click.createInterceptor(function(e, d, c) {
		this.SearchStore.baseParams.searchType = 'fulltext';
		this.SearchStore.baseParams.highlight = 1;
	}, this);
	
	Ext.apply(this,config,{
			title: 'Glossary'
		,	tbar: ['Term Search: &nbsp;',this.filterCombo,this.searchTerms, '&nbsp; Search Definition: &nbsp;', this.searchDefinition]
		,	items: [this.searchView]
		,	autoScroll: true		
		,	iconCls: 'iconSearch'	
	});

	Gbif.Glossary.WelcomePanel.superclass.constructor.call(this,config)

}

Ext.extend( Gbif.Glossary.WelcomePanel , Ext.Panel, {
 	
		initEvents : function(){
			this.body.on('click', this.onClick, this);
		} 		
		
	,	onClick: function(e, target){
			if (target = e.getTarget('a:not(.exi)', 3)) {
				e.stopEvent();
				var type = Ext.fly(target).getAttributeNS('gg', 'type');
				if (type == 'links') {
					if ( Ext.fly(target).getAttribute('lFlag') == 'false' ) {
						Ext.fly(target).set({lFlag: true});
						Ext.fly(target).child('img').addClass('refArrowOpen');
						Ext.fly(target).next('span').update('Hide Links');
						Ext.fly(target).next('div').setHeight(105, { duration : .5 });
					} else {
						Ext.fly(target).set({lFlag: false});
						Ext.fly(target).child('img').removeClass('refArrowOpen');
						Ext.fly(target).next('span').update('Show Links');
						Ext.fly(target).next('div').setHeight(0, { duration : .5 });
					}
					Ext.fly(target).blur();
				} else {					
					var title = Ext.fly(target).getAttributeNS('gg', 'title');
					var letter = Ext.fly(target).getAttributeNS('gg', 'letter');
					var icon = Ext.fly(target).getAttributeNS('gg', 'icon');
					var id = Ext.fly(target).getAttributeNS('gg', 'id');
					this.fireEvent('newTabAdd',type,title,letter,icon,id);
				}				
			}
 		}
		 
});